#override("css")
<link href="#springUrl('/static/css/bootstrap.min.css')" rel="stylesheet">
#end

#override("body")
<body class="white-bg">
<form id="baseForm"  class="form-horizontal m-t" autocomplete="off" data-validator-option="{timely:2, theme:'default', focusCleanup:true}">
	<div class="wrapper wrapper-content form-item">
		<div class="panel panel-default">
			<div class="row">
				<input type="hidden" name="id" value="$!{sysRole.id}">

				<br />
				<div class="col-xs-12">
					<div class="form-group">
						<label class="col-md-2 control-label">角色类型:</label>
						<div class="col-md-4">
							<div class="radio i-checks">
								<label><input type="radio" name="roleType" value="0" #if($!sysRole.roleType eq '0') checked="" #else '' #end><i></i>超级管理员</label>
								<label><input type="radio" name="roleType" value="1" #if($!sysRole.roleType eq '1') checked="" #else '' #end> <i></i>管理员</label>
								<label><input type="radio" name="roleType" value="2" #if($!sysRole.roleType eq '2') checked="" #else '' #end data-rule="checked"> <i></i>普通用户</label>
							</div>
						</div>
					</div>
				</div>
				<div class="col-xs-12">
					<div class="form-group">
						<label class="col-md-2 control-label">角色名称:</label>
						<div class="col-md-6">
							<input type="text" class="form-control" name="name" value="$!{sysRole.name}" placeholder="请输入角色名称" data-rule="角色名称:required;length(1~50)">
						</div>
					</div>
				</div>
				<div class="col-xs-12">
					<div class="form-group">
						<label class="col-md-2 control-label">角色状态:</label>
						<div class="col-md-6">
							<select class="form-control" name="state" data-rule="角色状态:required">
								<option value="0">可用</option>
								<option value="1">禁用</option>
							</select>
						</div>
					</div>
				</div>
				<div class="col-xs-12">
					<div class="form-group">
						<label class="col-md-2 control-label">排序:</label>
						<div class="col-md-6">
							<input type="number" class="form-control" name="sort" value="$!{sysRole.sort}" placeholder="请输入序号" data-rule="required:integer[+]:length[~3];sort">
						</div>
					</div>
				</div>
				<div class="col-xs-12">
					<div class="form-group">
						<label class="col-md-2 control-label">角色描述:</label>
						<div class="col-md-6">
							<textarea class="form-control" name="description" placeholder="请输入色描述" data-rule="描述色描述:length(~200)">$!{sysRole.description}</textarea>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</form>
</body>
#end

#override("js")
<script type="text/javascript">
	// 页面加载的时候调用的js
	$(function () {
		if ("$!{action}" == "doView") {
			$('input,select,textarea,checkbox,radio', $('form[id="baseForm"]')).attr('disabled', true);
		}
	});

	// 初始化表单验证及提交
	$("#baseForm").validator({
		focusCleanup: true,
		// 验证成功
		valid: function (form) {
			var me = this;
			// 提交表单之前，hold住表单，防止重复提交
			me.holdSubmit();

			$.ajax({
				url: "#springUrl('/sys/sysRole/doEdit')",
				data: $(form).serialize(),
				type: "POST",
				success: function (data) {
					if (data.success) {
						parent.refreshTable();
						parent.layer.alert('处理数据成功', {icon: 1}, function () {
							parent.layer.closeAll();
						});
					} else {
						parent.layer.alert(data.message, {icon: 2}, function (index) {
							//失败,提交表单成功后,释放hold,如果不释放hold,就变成了只能提交一次的表单
							me.holdSubmit(false);
							parent.layer.close(index);
						});
					}
				}
			});
		}
	});
	// 调用方法实现保存
	function save() {
		// 手工触发表单验证
		$("#baseForm").trigger('validate');
	}
</script>
#end
#extends("/common/base.html")